<ui:composition template="WEB-INF/template/main_template.xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core">

    <ui:define name="content">
        <h:form id="registrationForm">
            <h:panelGrid columns="3" cellpadding="5">
                <p:outputLabel for="registrationFirstName" value="#{msgs.firstName}"/>
                <p:inputText id="registrationFirstName" value="#{user.firstName}" required="true"
                             validatorMessage="#{msgs.registrationFirstNameValidatorMessage}"
                             requiredMessage="#{msgs.requiredMessage}">
                    <f:validateLength minimum="2"/>
                </p:inputText>
                <p:message for="registrationFirstName"/>

                <p:outputLabel for="registrationLastName" value="#{msgs.lastName}"/>
                <p:inputText id="registrationLastName" value="#{user.lastName}" required="false"
                             validatorMessage="#{msgs.registrationLastNameValidatorMessage}"
                             requiredMessage="#{msgs.requiredMessage}">
                    <f:validateLength minimum="2"/>
                </p:inputText>
                <p:message for="registrationLastName"/>

                <p:outputLabel for="registrationEmail" value="#{msgs.email}"/>
                <p:inputText id="registrationEmail" value="#{user.email}" required="true"
                             validatorMessage="#{msgs.registrationEmailValidatorMessage}"
                             requiredMessage="#{msgs.requiredMessage}">
                    <f:validateRegex pattern="[A-Za-z0-9.]*@[A-Za-z0-9.]*.[A-Za-z0-9.]"/>
                </p:inputText>
                <p:message for="registrationEmail"/>

                <p:outputLabel for="registrationPassword" value="#{msgs.password}"/>
                <p:password id="registrationPassword" value="#{user.password}" required="true"
                            validatorMessage="#{msgs.registrationPasswordValidatorMessage}"
                            requiredMessage="#{msgs.requiredMessage}">
                    <f:validateLength minimum="6"/>
                </p:password>
                <p:message for="registrationPassword"/>

                <p:outputLabel for="registrationPhone" value="#{msgs.phone}"/>
                <p:inputMask id="registrationPhone" mask="380999999999" value="#{user.phone}" required="true"
                             validatorMessage="#{msgs.registrationPhoneValidatorMessage}"
                             requiredMessage="#{msgs.requiredMessage}">
                    <f:validateLength minimum="12" maximum="12"/>
                </p:inputMask>
                <p:message for="registrationPhone"/>

                <p:outputLabel for="registrationBirthday" value="#{msgs.birthday}"/>
                <p:inputMask id="registrationBirthday" mask="99/99/9999" value="#{user.birthday}" required="false"
                             placeholder="#{msgs.day}/#{msgs.month}/#{msgs.year}">
                    <f:convertDateTime pattern="dd/MM/yyyy"/>
                </p:inputMask>
                <p:message for="registrationBirthday"/>

                <p:outputLabel for="registrationCity" value="#{msgs.city}"/>
                <p:selectOneMenu id="registrationCity" value="#{user.city}" required="true"
                                 requiredMessage="#{msgs.requiredMessage}">
                    <f:selectItem itemValue=""/>
                    <f:selectItems value="#{userController.cities}" var="c" itemValue="#{c}"
                                   itemLabel="#{c.name}"/>
                    <f:converter binding="#{cityConverter}"/>
                </p:selectOneMenu>
                <p:message for="registrationCity"/>

                <p:outputLabel for="registrationAddress" value="#{msgs.address}"/>
                <p:inputText id="registrationAddress" value="#{user.address}" required="false"/>
                <p:message for="registrationAddress"/>
            </h:panelGrid>

            <div id="registrationButton">
                <h:commandButton value="#{msgs.createAccount}" action="#{userController.createNewUser}"/>
            </div>
        </h:form>
    </ui:define>
</ui:composition>